<style lang="less" scoped>
	@border-color:#E3E8EA;//边框颜色
	@font-color:#686E71;//正常字体颜色
	@primary-color:#FE9333;//橘黄色默认颜色
	*{word-wrap:break-word;}
	.homeInfo{
		width: 1200px;
		min-height: 662px;
		margin: 70px auto 150px;
		border: 1px solid @border-color;
		background-color: #fff;
		.tabs{
			height: 40px;
			font-size: 14px;
			color: @font-color;
			padding: 0 40px;
			border-bottom: 1px solid #E3E8EA;
			span{
				display: inline-block;
				margin-right: 40px;
				line-height: 40px;
				cursor: pointer;
			}
			span:hover{
				color: @primary-color;
			}
			.on{
				color: @primary-color;
				border-bottom: 2px solid @primary-color;
				line-height: 36px;
			}
		}
		.tabinfo{
			padding-top: 30px;
			position: relative;
		}
		.notInfo{
			width: 100%;
			height: 580px;
			text-align: center;
			color:@font-color;
			img{
				display: inline-block;
				width: 120px;
				height: 120px;
				margin:99px auto 21px;
			}
			p{
				font-size: 14px;
				margin-bottom: 20px;
				color: #686E71;
			}
			Button{
				font-size: 14px;
				padding: 5px 32px;
				box-shadow: 4px 4px 4px 0 rgba(241,100,115,0.21);
				border-radius: 4px;
			}
		}
		.haveinfo{
			width: 100%;
			padding: 0 5px 31px 35px;
			.haveinfo-div{
				width: 200px;
				height: 417px;
				border: 1px solid @border-color;
				border-radius: 4px;
				float: left;
				margin-right: 31px;
				margin-bottom: 31px;
				cursor: pointer;
				box-shadow: 2px 2px 4px 0 rgba(255, 211, 214, 0.37);
				transition: all 0.1s;				
				.haveinfo-top{
					width: 100%;
					height: 320px;
					position: relative;
					.isPublic{//是否公开
						position: absolute;
						top:-2px;
						left: -2px;
						width: 44px;
						height: 43px;
						z-index: 2;
						img{
							width: 100%;
							height: 100%;
						}
					}
					.checkStatus{//审核状态
						position: absolute;
						top:-2px;
						left: -2px;
						width: 69.7px;
						height: 68.7px;
						z-index: 1;
						img{
							width: 100%;
							height: 100%;
						}
					}	
					.haveinfo-top-headimg{
						position: relative;
						width: 100%;
						height: 100%;
						overflow: hidden;
						.div{
							transform: scale(0.53);
							top: -143px;
							left: -49px;
							width: 100%;
							position: absolute;
						}
					}
					.haveinfo-top-hover{
						position: absolute;
						top:0;
						left:0;
						width: 100%;
						height: 100%;
						background-color: rgba(0,0,0,0.7);
						z-index: 3;
						border-top-left-radius: 4px;
						border-top-right-radius: 4px;
						display: none;
						p{
							margin-top: 50px;
							text-align: center;
							color:#fff;
							font-size: 14px;
						}
						.haveinfo-top-ewmimg{
							width: 150px;
							height: 150px;
							margin: 18px 25px 0;
						}
						.haveinfo-top-more{
							position: absolute;
							top:10px;
							right:10px;
							width: 24px;
							height: 24px;
							background-color: #F6FAF9;
							border: 1px solid @border-color;
							border-radius: 2px;
							span{
								position: absolute;
								top:3px;
								right:3px;
								width: 16px;
								height: 16px;
								cursor:pointer;
								img{
									width: 100%;
									height: 100%;
								}
							}
							ul{
								width: 92px;
								position: absolute;
								top:22px;
								right: -1px;
								background-color: #F6FAF9;
								text-align: justify;
								padding: 10px 10px 6px;
								border-bottom-left-radius: 4px;
								border-bottom-right-radius: 4px;
								display: none;
								li{
									line-height: 17px;
									font-size: 12px;
									color:@font-color;
									margin-bottom: 4px;
								}
								li:hover{
									color:@primary-color;
									cursor: pointer;
								}
							}
							
						}
						.haveinfo-top-more:hover ul{
							display: block;
						}
						//审核未通过显示的按钮
						.haveinfo-top-not{
							margin-top: 184px;
							div{
								width: 140px;
								height: 36px;
								text-align: center;
								line-height: 36px;
								border: 1px solid #FE9333;
								border-radius: 4px;
								font-size: 14px;
								color: #FE9333;
								margin: 0 0 20px 30px;
							}
							div:hover{
								background: #FE9333;
								color:#fff;
							}

						}
					}
				}
				.haveinfo-top:hover .haveinfo-top-hover{
					display: block;
				}
				.haveinfo-bottom{
					width: 100%;
					height: 97px;
					padding: 8px 14px 12px;
					.haveinfo-bottom-name{
						color:@font-color;
						font-weight: bold;
						font-size: 14px;
						line-height: 22px;
						height: 22px;
						padding-right:17px;
						white-space:nowrap;
						text-overflow:ellipsis;
						overflow:hidden;
						position: relative;
						span{
							position: absolute;
							top:3px;
							right:0;
							width: 16px;
							height: 16px;
							background: url('../../images/list_double@3x.png') no-repeat;
							background-size: 100% 100%;
						}
					}
					.haveinfo-bottom-time{
						color:@font-color;
						font-size: 12px;
						line-height: 17px;
						height: 17px;
					}
					.haveinfo-bottom-yk{
						height: 31px;
						margin-top: 7px;
						border-top: 1px solid #E3E8EA;
						div{
							width: 22px;
							height: 22px;
							border-radius: 50%;
							float: left;
							margin-right: 6px;
							margin-top: 8px;
							img{
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}
					}
				}
			}
			.haveinfo-div:hover{
				transition: all 0.1s;
				transform: translateY(-10px);
				box-shadow: 0 10px 40px 0 rgba(255, 211, 214, 0.37), 0 10px 20px 0 rgba(180, 189, 193, 0.65);				
			}
			.cread-div{
				float: left;
				width: 200px;
				height: 417px;
				border: 2px dashed #FE9333;
				border-radius: 4px;
				margin-right: 31px;
				img{
					width: 50px;
					height: 50px;
					margin: 169px 74px 0 78px;
				}
				p{
					font-size: 16px;
					color:@primary-color;
					display: inline-block;
					margin: 18px 0 0 68px;
					cursor: pointer;
				}
			}
		}
	}
	.creadZj{
		overflow: hidden;
		.creadZj-left{
			float: left;
			width: 220px;
			height: 360px;
			border: 0;
			img{
				width: 100%;
				height: 100%;
			}
		}
		.creadZj-right{
			float: left;
			width: 340px;
			height: 360px;
			p{
				color:@font-color;
				font-size: 14px;
				line-height: 22px;
				padding: 40px 0 0 30px;
			}
			.input{
				margin-top: 20px;
				margin-bottom: 163px;
			}
			.btn{
				margin-bottom: 0px;
				border-top: 1px solid @border-color;
				padding-top: 10px;
				span{
					font-size: 14px;
					color: @primary-color;
					margin: 0 30px 0 116px;
					cursor: pointer;
				}
			}
		}
	}

	.homeBottom{
		position: relative;
		bottom: -130px;
		left:0;
		width: 1200px;
		height: 93px;
		text-align: center;
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
		p{
			width: 180px;
			height: 40px;
			line-height: 40px;
			text-align: center;
			font-size: 14px;
			color: @font-color;
			border-radius: 40px;
			margin-left: 510px;
			background-color: @border-color;
			cursor: pointer;
			margin-top: 20px;
		}
	}
	.feedback{
		width: 42px;
		height: 154px;
		background-color: #fff;
		border: 1px solid #E3E8EA;
		position: fixed;
		right: 10px;
		bottom: 317px;
		padding: 2px;
		color: #686E71;
		li{
			width: 36px;
			height: 36px;
			margin-bottom: 1px;
			cursor: pointer;
			position: relative;
		}
		.f1{
			background: url('../../images/rightside_service_normal.png') no-repeat;
			background-size: 100% 100%;
			.div{
				position: absolute;
				width: 240px;
				height: 172px;
				background-color: #fff;
				border: 1px solid #E3E8EA;
				top: 0;
				left: -242px;
				display: none;
				padding: 15px;
				div{
					float: left;
					width: 100px;
					text-align: center;
					color:#686E71;
				}
				
			}
		}
		.f1:hover{
			background: url('../../images/rightside_service_hover.png') no-repeat;
			background-size: 100% 100%;
			.div{
				display: block;
			}
		}
		.f2{
			background: url('../../images/rightside_QR_normal.png') no-repeat;
			background-size: 100% 100%;
			.div{
				position: absolute;				
				width: 240px;
				height: 156px;
				background-color: #fff;
				border: 1px solid #E3E8EA;
				top: 0;
				left: -242px;
				display: none;
				padding: 15px;
				p{
					text-align: center;
					line-height: 17px;
					margin-bottom: 9px;
				}
				img{
					width: 100px;
					height: 100px;
				}
			}
		}
		.f2:hover{
			background: url('../../images/rightside_QR_hover.png') no-repeat;
			background-size: 100% 100%;
			.div{
				display: block;
			}
		}
		.f3{
			background: url('../../images/rightside_notice_normal.png') no-repeat;
			background-size: 100% 100%;
			.div{
				position: absolute;		
				width: 240px;
				height: 496px;
				background-color: #fff;
				border: 1px solid #E3E8EA;
				top: -200px;
				left: -242px;
				// display: none;
				padding: 15px;
				p{
					line-height: 22px;
					margin-bottom: 10px;
					font-size: 14px;
				}
			}
		}
		.f3:hover{
			background: url('../../images/rightside_notice_hover.png') no-repeat;
			background-size: 100% 100%;
			.div{
				// display: block;
			}
		}
		.f4{
			background: url('../../images/rightside_backtop_normal.png') no-repeat;
			background-size: 100% 100%;
			
		}
		.f4:hover{
			background: url('../../images/rightside_backtop_hover.png') no-repeat;
			background-size: 100% 100%;
		}
	}
</style>
<style lang="less">
	@border-color:#E3E8EA;//边框颜色
	@font-color:#686E71;//正常字体颜色
	@primary-color:#FE9333;//橘黄色默认颜色
	.ivu-modal-header{
		padding: 0 16px;
		.ivu-modal-header-inner{
			height: 40px;
			line-height: 40px;
			font-size: 14px;
			color: #686E71;
		}
	}
	.ivu-modal-close{
		top:4px;
	}
	.homeInfo{
		.ivu-tabs-bar{
			border-bottom: 1px solid @border-color;
			margin-bottom: 41px;
		}
		.ivu-tabs-nav .ivu-tabs-tab{
			padding:14.5px 0;
			margin-right:60px;
		}
		.ivu-tabs-nav .ivu-tabs-tab-active{
			border-bottom:3px solid @primary-color;			
		}
		.ivu-tabs-nav-scroll{
			padding-left: 40px;
		}
		.ivu-tabs-ink-bar{
			opacity: 0;
		}
	}
	.creadZj{
		.ivu-modal-body{
			padding: 0;
			overflow: hidden;
		}
		.ivu-modal-footer{
			display: none;
		}
		.ivu-input{
			width: 280px;
			margin-left: 30px;
			font-size: 14px;
			border: 1px solid #E3E8EA;
		}
		.ivu-form-item-error-tip{
			left:35px;
		}
		.ivu-btn-warning{
			padding: 8px 25px;
			font-size: 14px;
			border: 0;
			float: right;
    		margin-right: 30px;
		}
		.ivu-form-item-content{
			height: 36px;
			line-height: 36px;

		}

	}
	.chooseSSq{
		.ivu-modal-body{
			padding: 0;
		}
		.ivu-modal-footer button + button{
			padding: 7px 43px;
			font-size: 16px;
		}
		.ivu-modal-footer{
			border-top:1px solid @border-color;
		}
		.ivu-select{
			width: 160px;
		}
		.Selectprovince{
			margin-left: 50px;
		}
		.ivu-modal-footer{
			display: none;
		}
		.bottom{
			border-top: 1px solid #E3E8EA;
			padding: 12px 18px 12px 18px;
			text-align: right;
			margin-top: 133px;
			.cancel{
				font-size: 16px;				
			}
			.ok{
				padding: 8px 43px;
				font-size: 16px;
			}
		}
		
		p{
			margin: 40px 0 20px 0;
			font-size: 14px;
			color:@font-color;
			padding-left: 50px;
		}
	}
	//缩小版弹窗开始
	.mxDataModal{
		.info{
			width: 100%;
			height: 339px;
			padding: 30px;
			.t1{
				height: 90px;
				position: relative;
				font-size: 14px;
				.span{
					display: inline-block;
					width: 56px;
					line-height: 22px;
					color: #686E71;
					vertical-align: top;
					font-size: 14px;
				}
				.img{
					width: 130px;
					height: 90px;
					position: absolute;
					top:0;
					left:75px;
					display: flex;
					justify-content: center;
					align-items: center;
					border-radius: 4px;
					img{
						max-width: 100%;
						max-height: 100%;
					}
				}
				.btn{
					position: absolute;
					left:236px;
					top:50px;
					width: 80px;
					height: 30px;
					border: 1px solid @primary-color;
					color: @primary-color;
					line-height: 30px;
					text-align: center;
					font-size: 14px;
					border-radius: 4px;
					cursor: pointer;
				}
				.pop{
					position: absolute;
					left:236px;
					top:20px;
					font-size: 12px;
					color: #F16473;
				}
			}
			.t2{
				margin: 10px 0;
				font-size: 14px;
				.ivu-select{
					width: 164px;
					margin-top: 10px;
					 .ivu-select-placeholder ,.ivu-select-selection, .ivu-select-selected-value{						
						font-size: 14px;
					}
				}
				.ivu-input-wrapper{
					margin-top: 10px;
					width: 164px;
					
				}
			}	
			.t3{
				font-size: 14px;
				span{
					display: block;
					vertical-align: -webkit-baseline-middle;
					width: 51px;
				}
				.ivu-input-wrapper{
					margin-top: 10px;
				}

			}
		}
		.ivu-modal-body{
			padding: 0;
		}
		.ivu-modal-footer{
			display: none;
		}
		.bottom{
			border-top: 1px solid #E3E8EA;
			padding: 12px 18px 12px 18px;
			text-align: right;
			.pop{
				color: #F16473;
				font-size: 12px;
				float: left;
				line-height: 43px;
				padding-left: 12px;
			}
			.cancel{
				font-size: 14px;				
			}
			.ok{
				padding: 5px 33px;
				font-size: 14px;
			}
		}
	}
	//缩小版弹窗结束
	.userDataModal{
		.info{
			width: 100%;
			padding: 30px 30px 49px 30px;
			ul{
				width: 100%;
				li{
					width: 100%;
					margin-bottom: 10px;
					font-size: 14px;
					span{
						display: inline-block;
						vertical-align: middle;
						margin-right: 6px;
					}
					.ivu-select{
					
						.ivu-select-placeholder ,.ivu-select-selection, .ivu-select-selected-value{
							font-size: 14px;
						}
					}
					.ivu-radio-wrapper{
						font-size: 14px;
					}
					.ivu-radio-inner:after{
						left: 3px;
						top: 3px;
					}
					.ivu-radio-inner{
						width: 16px;
						height: 16px;
						vertical-align: baseline;
					}
				}
			}
		}
		.ivu-modal-body{
			padding: 0;
		}
		.ivu-modal-footer{
			display: none;
		}
		.ivu-input-icon{
			height: 40px;
			line-height: 40px;
		}
		.bottom{
			border-top: 1px solid #E3E8EA;
			padding: 8px 18px 12px 18px;
			text-align: right;
			.cancel{
				font-size: 14px;				
			}
			.ok{
				padding: 5px 33px;
				font-size: 14px;
			}
		}
	}
	.feedback{
		.ivu-input-wrapper{
			margin-bottom: 10px;
		}
		.ivu-radio-wrapper{
			width: 102px;
			margin-right: 0;
			margin-bottom: 11px;
		}
		.ivu-input{
			height: 36px;
			line-height: 36px;
		}
		textarea.ivu-input{
			width: 210px;
			height: 100px;
			resize: none;
		}
		Button{
			margin-left: 65px;
			margin-top: 6px;
		}
	}
	

</style>
<template>
	<div @click="bodyClick">
		<v-header ></v-header> 
		<!-- 传记内容 -->
		<div class="homeInfo">
			<!--标题-->
			<div class="tabs">
				<span :class="tabpance1" @click="tabsFun">人物传记</span>
				<span :class="tabpance2" @click="tabsFun2">我的足迹</span>
				<span :class="tabpance3" @click="tabsFun3">未发布的传记</span>
			</div>
			<!--内容-->
			<div  v-if="tabShow" class="tabinfo">
				<!--缺省页面-->
				<div class="notInfo" v-if="havedata">
					<img src="../../images/nowrite.png" />
					<p>暂无人物传记，请先创建</p>
					<Button type="warning" @click="creadZj()">新建传记</Button>
				</div>
				<div class="haveinfo clearfix" v-if="!havedata">
					<!--新建传记-->
					<div class="cread-div" @click="creadZj()">
						<img src="../../images/add.png" />
						<p>创建传记</p>
					</div>
					<div class="haveinfo-div"  v-for="(item,index) in zjdata" @click="checkBiography(item.cemeteryId,item.template,item.status)"><!--传记块-->
						<div class="haveinfo-top"><!--上部-->
							<!-- 是否公开 -->
							<div class="isPublic" v-show="item.openStatus==2 && item.status==3">
								<img src="../../images/corner_gongkai@3x.png"/>
							</div>
							<!-- 审核状态 -->
							<div class="checkStatus">
								<img src="../../images/corner_shz@3x.png" v-show="item.status==2"/><!-- 待审核状态 -->
								<img src="../../images/corner_ysh@3x.png" v-show="item.status==3"/><!-- 成功状态 -->
								<img src="../../images/corner_shsb@3x.png" v-show="item.status==4"/><!-- 审核失败状态 -->
							</div>
							<div class="haveinfo-top-headimg">
								<div class="div">
									<div :style="item.IntroduceModule.headerStyle">
										<!--头像-->
										<div :style="item.IntroduceModule.moduleImageDivStyle"><img :src="hotsimg+item.IntroduceModule.cemeteryIntroduction.headPictureSource" style="width: 100%;height: 100%;"/></div>
										<!--姓名-->
										<div :style="item.IntroduceModule.nameStyle" ref="nameStyle">{{item.IntroduceModule.cemeteryIntroduction.userName}}</div>
										<!--出生日期-->
										<div :style="item.IntroduceModule.introductionDayStyle" ref="introductionStyle">{{birthdayTime(item.IntroduceModule.cemeteryIntroduction.birthDay)+birthDayAnd+birthdayTime(item.IntroduceModule.cemeteryIntroduction.deadDay)}}</div>
										<!--个人简介-->
										<div :style="item.IntroduceModule.introductionStyle" ref="introductionDayStyle">{{item.IntroduceModule.cemeteryIntroduction.introduction}}</div>			
										<v-edittext :textflag="item.IntroduceModule.templateModuleContent"></v-edittext>
										<img  :src="hotsimg+item1.picSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModulePicDTO" ref="picstyle" :style="item1.picStyle">
										<img  :src="hotsimg+item1.videoPicSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModuleVideoDTO" ref="spstyle" :style="item1.videoStyle">
									</div>
								</div>
							</div>
							<div class="haveinfo-top-hover"><!--hover-->
								<p v-show="item.status != 4">手机扫一扫查看</p>
								<img :src="item.qrcodeImageUrl" class="haveinfo-top-ewmimg" v-show="item.status != 4"/><!--二维码图片-->
								<div class="haveinfo-top-more" @click.stop="" v-show="item.status != 4">
									<span><img src="../../images/maskset.png" /></span>
									<ul>
										<li @click.stop="mxDataEdit(item.cemeteryId,item.graveId)">墓穴信息编辑</li>
										<!-- <li @click.stop="gzDataEdit(item.cemeteryId)">故者基本资料</li> -->
										<li @click.stop="editZj(item.template,item.cemeteryId,item.status)">传记内容编辑</li>
										<li @click.stop="applicationPublic(item.cemeteryId)" v-if="(item.openStatus==3||item.openStatus==4||item.openStatus==null) && item.status==3">申请公开展示</li>
										<li v-if="item.status==2">传记正在审核</li>
										<li v-if="item.openStatus==1&&item.status==3">申请中请等待</li>
										<li v-if="item.openStatus==2&&item.status==3" @click.stop="cancelPublic(item.cemeteryId)">取消公开展示</li>
										<li @click.stop="deleteZj(item.cemeteryId,item.graveId,1)">删除</li>
									</ul>
								</div>
								<!-- 审核不通过之后显示的按钮 -->
								<div v-show="item.status == 4" class="haveinfo-top-not">
									<div @click.stop="editZj(item.template,item.cemeteryId,item.status)">编辑传记</div>
									<div @click.stop="deleteZj(item.cemeteryId,item.graveId,1)">删除传记</div>
								</div>
							</div>
						</div>				
						<div class="haveinfo-bottom"><!--下部-->
							<p class="haveinfo-bottom-name">{{item.userName}}<span v-show="item.graveType == 2" title="双人穴"></span></p>
							<p class="haveinfo-bottom-time"><span>{{item.birthDay?filter(item.birthDay):""}}</span><span v-show="item.birthDay">-</span><span>{{item.deadDay?filter(item.deadDay):""}}</span></p>
							<div class="haveinfo-bottom-yk"><!--游客-->
								<div v-for="(item,index) in item.visitors">
									<img :src=" item.headerPicture? hotsimg+item.headerPicture: staticimg+'/images/Visitorsmoren.png' " />										
								</div>
								<div v-if="item.visitors.length > 4"><img src="../../images/moreVisitors.png" /></div>
							</div>
						</div>
					</div>						
				</div>
				<!--加载更多 和 到底部分 人物传记部分-->
				<div class="homeBottom" v-show="!havedata">
					<!-- 分页 -->
					<Page show-total show-elevator :total="zjdatatotal" :page-size="14" @on-change="ajaxMorePage" :current="PageNum"></Page>
				</div>
			</div>
			<div  v-if="tabShow2" class="tabinfo"> 
				<!--缺省页面-->
				<div class="notInfo" v-if="myjoinhavedata">
					<img src="../../images/nowrite.png" />
					<p>暂无人物传记，请先创建</p>
				</div>
				<div class="haveinfo clearfix" v-if="!myjoinhavedata">			
					<div class="haveinfo-div"  v-for="(item,index) in joindata" @click="checkBiography(item.cemeteryId,item.template,item.status)"><!--传记块-->
						<div class="haveinfo-top"><!--上部-->
							<!-- 是否公开 -->
							<div class="isPublic" v-show="item.openStatus==2">
								<img src="../../images/corner_gongkai@3x.png"/>
							</div>
							<div class="haveinfo-top-headimg">
								<div class="div">
									<div :style="item.IntroduceModule.headerStyle">
										<!--头像-->
										<div :style="item.IntroduceModule.moduleImageDivStyle"><img :src="hotsimg+item.IntroduceModule.cemeteryIntroduction.headPictureSource" style="width: 100%;height: 100%;"/></div>
										<!--姓名-->
										<div :style="item.IntroduceModule.nameStyle" ref="nameStyle">{{item.IntroduceModule.cemeteryIntroduction.userName}}</div>
										<!--出生日期-->
										<div :style="item.IntroduceModule.introductionDayStyle" ref="introductionStyle">{{birthdayTime(item.IntroduceModule.cemeteryIntroduction.birthDay)+birthDayAnd+birthdayTime(item.IntroduceModule.cemeteryIntroduction.deadDay)}}</div>
										<!--个人简介-->
										<div :style="item.IntroduceModule.introductionStyle" ref="introductionDayStyle">{{item.IntroduceModule.cemeteryIntroduction.introduction}}</div>			
										<v-edittext :textflag="item.IntroduceModule.templateModuleContent"></v-edittext>
										<img  :src="hotsimg+item1.picSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModulePicDTO" ref="picstyle" :style="item1.picStyle">
										<img  :src="hotsimg+item1.videoPicSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModuleVideoDTO" ref="spstyle" :style="item1.videoStyle">
									</div>
								</div>
							</div>
							<div class="haveinfo-top-hover"><!--hover-->
								<p>手机扫一扫查看</p>
								<img :src="item.qrcodeImageUrl" class="haveinfo-top-ewmimg"/><!--二维码图片-->
							</div>
						</div>
						<div class="haveinfo-bottom"><!--下部-->
							<p class="haveinfo-bottom-name">{{item.userName}}<span v-show="item.graveType == 2" title="双人穴"></span></p>
							<p class="haveinfo-bottom-time"><span>{{item.birthDay?filter(item.birthDay):""}}</span><span v-show="item.birthDay">-</span><span>{{item.deadDay?filter(item.deadDay):""}}</span></p>
							<div class="haveinfo-bottom-yk"><!--游客-->
								<div v-for="(item,index) in item.visitors">
									<img :src=" item.headerPicture? hotsimg+item.headerPicture: staticimg+'/images/Visitorsmoren.png' " />										
								</div>
								<div v-if="item.visitors.length > 4"><img src="../../images/moreVisitors.png" /></div>
							</div>
						</div>
					</div>						
				</div>
				<!--加载更多 和 到底部分 人物传记部分-->
				<div class="homeBottom" v-show="!myjoinhavedata">
					<Page show-total show-elevator :total="joindatatotal" :page-size="14" @on-change="myjoinajaxMorePage" :current="myjoinPageNum"></Page>
				</div>
			</div>
			<div  v-if="tabShow3" class="tabinfo">
				<!--缺省页面-->
				<div class="notInfo" v-if="Nothavedata">
					<img src="../../images/nowrite.png" />
					<p>暂无人物传记，请先创建</p>
				</div>
				<div class="haveinfo clearfix" v-if="!Nothavedata">			
					<div class="haveinfo-div"  v-for="(item,index) in Notdata"><!--传记块-->
						<div class="haveinfo-top"><!--上部-->
							<div class="haveinfo-top-headimg">
								<div class="div">
									<div :style="item.IntroduceModule.headerStyle">
										<!--头像-->
										<div :style="item.IntroduceModule.moduleImageDivStyle"><img :src="hotsimg+item.IntroduceModule.cemeteryIntroduction.headPictureSource" style="width: 100%;height: 100%;"/></div>
										<!--姓名-->
										<div :style="item.IntroduceModule.nameStyle" ref="nameStyle">{{item.IntroduceModule.cemeteryIntroduction.userName}}</div>
										<!--出生日期-->
										<div :style="item.IntroduceModule.introductionDayStyle" ref="introductionStyle">{{birthdayTime(item.IntroduceModule.cemeteryIntroduction.birthDay)+birthDayAnd+birthdayTime(item.IntroduceModule.cemeteryIntroduction.deadDay)}}</div>
										<!--个人简介-->
										<div :style="item.IntroduceModule.introductionStyle" ref="introductionDayStyle">{{item.IntroduceModule.cemeteryIntroduction.introduction}}</div>			
										<v-edittext :textflag="item.IntroduceModule.templateModuleContent"></v-edittext>
										<img  :src="hotsimg+item1.picSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModulePicDTO" ref="picstyle" :style="item1.picStyle">
										<img  :src="hotsimg+item1.videoPicSourcePath" v-for="(item1,index) in item.IntroduceModule.templateModuleVideoDTO" ref="spstyle" :style="item1.videoStyle">
									</div>
								</div>
							</div>
							<div class="haveinfo-top-hover"><!--hover-->								
								<!-- 审核不通过之后显示的按钮 -->
								<div  class="haveinfo-top-not">
									<div @click.stop="editZj(item.template,item.cemeteryId,4)">编辑传记</div>
									<div @click.stop="deleteZj(item.cemeteryId,item.graveId,3)">删除传记</div>
								</div>
							</div>
						</div>
						<div class="haveinfo-bottom"><!--下部-->
							<p class="haveinfo-bottom-name">{{item.userName}}<span v-show="item.graveType == 2" title="双人穴"></span></p>
							<p class="haveinfo-bottom-time"><span>{{item.birthDay?filter(item.birthDay):""}}</span><span v-show="item.birthDay">-</span><span>{{item.deadDay?filter(item.deadDay):""}}</span></p>
							<div class="haveinfo-bottom-yk"><!--游客-->
								<div v-for="(item,index) in item.visitors">
									<img :src=" item.headerPicture? hotsimg+item.headerPicture: staticimg+'/images/Visitorsmoren.png' " />										
								</div>
							</div>
						</div>
					</div>						
				</div>
				<!--加载更多 和 到底部分 人物传记部分-->
				<div class="homeBottom" v-show="!Nothavedata">
					<Page show-total show-elevator :total="Notdatatotal" :page-size="14" @on-change="NotajaxMorePage" :current="NotPageNum"></Page>
				</div>
			</div>		 
		</div>
		<!--新建传记弹窗-->
		<Modal v-model="creadZjMod" class="creadZj" :width="560" @on-cancel="closeCread">
			<div class="creadZj-left"><img src="../../images/creatNew.png"/></div>
			<div class="creadZj-right">
				<p>为了更好地让我们为您服务 <br/>请输入二维码编码</p>
				<Form ref="formUserEwm" :model="formQrcode" :rules="formQrcodeRule"  class="">
					<Form-item class="input" prop="number">
						<Input type="text" v-model="formQrcode.number" placeholder="请输入您的二维码编码" :maxlength="15"></Input>
					</Form-item>	
					<Form-item class="btn">
						<!-- <span @click="notEwmNext()">无二维码编码</span> -->
						<Button type="warning" @click="CreatSubmit('formUserEwm')">下一步</Button>
					</Form-item>				
				</Form>
			</div>
			<div slot="footer" class="creatfooter"></div>
		</Modal>
		<!--选择省市区-->
		<Modal 
			title="基本资料"
			v-model="chooseSSqMod" class="chooseSSq" :width="560">
			<p>传记人所在地</p>
			 <Select  v-model="province" class="Selectprovince" placeholder="请选择省">
				 <Option value="" label-in-value="true">{{"请选择省"}}</Option>
				<Option v-for="item in provinceList" :value="item.areaId" :key="item" label-in-value="true">{{ item.areaName }}</Option>
			</Select>
			<Select  v-model="city" placeholder="请选择市">
				<Option value="" label-in-value="true">{{"请选择市"}}</Option>
				<Option v-for="item in cityList" :value="item.areaId" :key="item" >{{ item.areaName }}</Option>
			</Select>
			<Select  v-model="district" placeholder="请选择区" >
				<Option value="" label-in-value="true">{{"请选择区"}}</Option>				
				<Option v-for="item in districtList" :value="item.areaId" :key="item">{{ item.areaName }}</Option>
			</Select>
			<div class="bottom">
				<Button type="text" class="cancel" @click="chooseSSqMod=false">取消</Button>
				<Button type="warning" class="ok"  @click="chooseTemplate()">确定</Button>
			</div>
		</Modal>
		<!--墓穴信息编辑弹窗-->
		<Modal 
			title="墓穴信息"
			v-model="mxDataModal" class="mxDataModal" :width="560">
			<div class="info">
				<div class="t1">
                    <span class="span">上传证书</span>                       
					<div  class="img">
						<!--<img  :src=" !hasMxphoto ? hotsimg + mxDataObj.certificatePath :  hotsimg+'/images/30.png' " /> 					-->
						<img  :src=" mxDataObj.certificatePath ? hotsimg + mxDataObj.certificatePath :  staticimg+'/images/zhengshu.png' " /> 					
					</div>                        					
					<p class="pop" v-show="!mxDataObj.certificatePath">请上传您的证书信息</p>
					<Upload  :on-success="handleSuccess" 
					:format="['jpg','jpeg','png']"
                	:on-format-error="uploadPhotoError"
					:show-upload-list="false" 
					:action="hostUrl+'/cemeteryGrave/uploadCertificate'" :headers="tokendata" name="certificate">
                        <div class="btn">上传文件</div>                                
                    </Upload>   					
				</div>
				<div class="t2">
					<p>墓穴位置</p>
					<div>                                             
						<Select  v-model="mxDataObj.cemeteryProvinceId" class="Selectprovince" placeholder="请选择省">
							<Option value="" label-in-value="true">{{"请选择省"}}</Option>							
							<Option v-for="item in provinceList2" :value="item.areaId" :key="item" label-in-value="true">{{ item.areaName }}</Option>
						</Select>
						<Select  v-model="mxDataObj.cemeteryCityId" placeholder="请选择市">
							<Option value="" label-in-value="true">{{"请选择市"}}</Option>
							<Option v-for="item in cityList2" :value="item.areaId" :key="item" >{{ item.areaName }}</Option>
						</Select>
						<Select  v-model="mxDataObj.areaId" placeholder="请选择区">
							<Option value="" label-in-value="true">{{"请选择区"}}</Option>							
							<Option v-for="item in districtList2" :value="item.areaId" :key="item">{{ item.areaName }}</Option>
						</Select>
					</div> 
					<Select  v-model="mxDataObj.cemeteryNameId" placeholder="请选择陵园">
						<Option value="" label-in-value="true">{{"请选择陵园"}}</Option>													
						<Option v-for="item in lyList" :value="item.id" :key="item">{{ item.cemeteryName }}</Option>
					</Select>
					<Select  v-model="mxDataObj.cemeteryParkId" placeholder="请选择园区">
						<Option value="" label-in-value="true">{{"请选择园区"}}</Option>	
						<Option v-for="item in yqList" :value="item.id" :key="item">{{ item.cemeteryName }}</Option>
					</Select>
					<Input v-model="mxDataObj.address" placeholder="请输入详细地址" :maxlength="50"></Input>
				</div>
				<div class="t3">
					<span>穴位号</span>
					<Input v-model="mxDataObj.acupointNumber" placeholder="为方便您进行墓地二维码扫描祭扫，请您务必填写穴位号" :maxlength="50"></Input>
				</div>
			</div>
			
			<div class="bottom">
				<p class="pop">为了更好地为您提供服务，请务必填写真实资料</p>				
				<Button type="text" class="cancel" @click="mxDataModal = false">取消</Button>
				<Button type="warning" class="ok" @click="submitMxData()">确定</Button>
			</div>
		</Modal>
		<!--基本资料编辑弹窗-->
		<Modal 
			title="基本资料"
			v-model="userDataModal" class="userDataModal" :width="560">
			<div class="info">
				<ul>
					<li>
						<span>姓名</span>
						<Input v-model="zjDataObj.fullName" placeholder="请输入真实姓名" style="width:242px;"></Input>
						<span style="margin-left: 25px;margin-right:25px;">性别</span>
						 <Radio-group v-model="zjDataObj.gender">
							<Radio label="M" value="">{{"男"}}</Radio>
							<Radio label="F" value="">{{"女"}}</Radio>
                    	</Radio-group> 
					</li>
					<li>
						<span>民族</span>
						<Select  v-model="zjDataObj.nation" placeholder="请选择民族" style="width:147px;">
							<Option value="" label-in-value="true">{{"请选择民族"}}</Option>								
							<Option v-for="item in nationList" :value="item.sortNum" :key="item">{{ item.value }}</Option>
						</Select>
						<span style="margin-left:30px;">生卒</span>
						<Date-picker type="daterange" placement="bottom-start" placeholder="选择日期" :value="zjDataObj.birthAndDeathDate" :clearable="false" @on-change="timeChoose" @on-clear="timeChoose" style="width:243px;display: inline-block;" :editable="false"></Date-picker>
					</li>
					<li>
						<!-- <span>证件</span>
						<Select  v-model="zjDataObj.cardType" placeholder="请选择证件类型" style="width:147px;">
							<Option v-for="item in idcardList" :value="item.sortNum" :key="item">{{ item.value }}</Option>
						</Select> -->
						<span >证件</span>
						<Input v-model="zjDataObj.cardNo" placeholder="请输入身份证号" style="width:462px" :maxlength="20"></Input>
					</li>
					<li>
						<span>籍贯</span>
						<Select  v-model="zjDataObj.nativeProvinceId" placeholder="请选择省" style="width:151px;">
							<Option value="" label-in-value="true">{{"请选择省"}}</Option>								
							<Option v-for="item in jgprovinceList" :value="item.areaId" :key="item">{{ item.areaName }}</Option>
						</Select>
						<Select  v-model="zjDataObj.nativeCityId" placeholder="请选择市" style="width:151px;">
							<Option value="" label-in-value="true">{{"请选择市"}}</Option>															
							<Option v-for="item in jgcityList" :value="item.areaId" :key="item">{{ item.areaName }}</Option>
						</Select>
						<Select  v-model="zjDataObj.nativeAreaId" placeholder="请选择区" style="width:151px;">
							<Option value="" label-in-value="true">{{"请选择区"}}</Option>																						
							<Option v-for="item in jgdistrictList" :value="item.areaId" :key="item">{{ item.areaName }}</Option>
						</Select>
					</li>
					
					
				</ul>
			</div>
			<div class="bottom">
				<Button type="text" class="cancel" @click="userDataModal = false">取消</Button>
				<Button type="warning" class="ok"  @click="submitZjData()">确定</Button>
			</div>
		</Modal>
		<!--意见反馈-->
		<v-feedback :backModalType="backModal" @backModalTypeFun="showBackModal"></v-feedback>
		<v-footer></v-footer>
	</div>
</template>
<script>
   import global from '../../config/global'
	import { mapState } from 'vuex'
    import { USER_SIGNIN } from 'store/user'
    export default {
        computed: mapState({ user: state => state.user }),
		data(){
			return{
				creadZjMod:false,//创建传记弹窗
				chooseSSqMod:false,//选择省市区
				havedata:false,//是否有数据
				myjoinhavedata:false,//我参加的是否有数据
				Nothavedata:false,//未发布的是否有数据
				zjdata:[],//传记信息
				joindata:[],//我参加的
				Notdata:[],//我参加的
				staticimg:global.staticimg,
				hotsimg:global.imgurl,//图片前缀
				hostUrl:global.host,//图片前缀
				nothavemore:false,//是否还有数据
				myjoinnothavemore:false,//我参加的是否还有数据
				Notnothavemore:false,//未发布的是否还有数据
				PageNum:1,//当前页码
				myjoinPageNum:1,//我参加页面页码
				NotPageNum:1,//未发布的页面页码
				formQrcode:{
					number:'',
				},
				province:"",
				city:"",
				district:"",
				provinceList:[],
				cityList:[],
				districtList:[],
				tabpance1:'',//标题样式
				tabpance2:'',
				tabpance3:'',
				tabShow:true,
				tabShow2:false,
				tabShow3:false,
				mxDataModal:false,//墓穴信息编辑弹窗
				userDataModal:false,//基本资料编辑弹窗
				mxDataObj:{
					"certificatePath":"",//证书图片
					"cemeteryProvinceId":"",//省
					"cemeteryCityId":"",//市
					"areaId":"",//区
					"cemeteryNameId":"",//陵园
					"cemeteryParkId":"",//园区
					"address":"",//详细地址
					"acupointNumber":"",//墓穴号
					"graveId":"",
					"cemeteryId":"",
					"source":1,
				},
				provinceList2:[],
				cityList2:[],
				districtList2:[],
				lyList:[],
				yqList:[],
				hasMxphoto:false,
				tokendata:{},
				mxDataId:"",//墓穴信息编辑所需ID
				zjDataObj:{
                    "cemeteryId":"",//墓主ID
                    "cardType":"",//证件类型
                    "cardNo":"",//证件号
                    "fullName":"",//真是姓名
                    "gender":"",//性别
                    "nation":"",//民族
                    "nativeAreaId":"",//籍贯区
                    "nativeCityId":"",//籍贯市
                    "nativeProvinceId":"",//籍贯省
					"source":1,
                },
				nationList:[],//民族列表
                idcardList:[],//证件类型列表
                jgprovinceList:[],
                jgcityList:[],
                jgdistrictList:[],
				formQrcodeRule:{
					number:[{ required: true, message: '请输入您的二维码编码', trigger: 'blur' }]
				},
				IntroduceModule:"",
				birthDayAnd:"",
				backModal:false,//反馈弹窗
				zjdatatotal:1,
				joindatatotal:1,
				Notdatatotal:1,
			}
		},
		created() {
			this.tabsFun();
		},
		mounted(){
			document.body.scrollTop = 0;
            document.documentElement.scrollTop = 0;
		},
		watch:{
			// $route: 'ajax',
			province:"getprovince",
			city:"getcity",
			district:"getdistrict",
			"mxDataObj.cemeteryProvinceId":"getcity2",//墓穴信息地址
			"mxDataObj.cemeteryCityId":"getqu2",//
			"mxDataObj.areaId":"getly",//
			"mxDataObj.cemeteryNameId":"getyq",//
			"zjDataObj.nativeProvinceId":"getcity3",//墓穴信息地址
			"zjDataObj.nativeCityId":"getqu3",//
		},
		methods:{
			tabsFun(){//点击人物传记
				this.PageNum=1;
				this.nothavemore = false;
				this.ajaxMore();
				this.tabShow = true;
				this.tabShow2 = false;
				this.tabShow3 = false;
				this.tabpance1 = 'on';
				this.tabpance2 = '';
				this.tabpance3 = '';
			},
			tabsFun2(){//点击我参加的
				this.myjoinPageNum =1;
				this.myjoinnothavemore = false;
				this.tabShow = false;
				this.tabShow2 = true;
				this.tabShow3 = false;
				this.tabpance1 = '';
				this.tabpance2 = 'on';
				this.tabpance3 = '';
				this.myjoinajaxMore();
			},
			tabsFun3(){//点击未发布的
				this.NotPageNum = 1;
				this.Notnothavemore = false;
				this.tabShow = false;
				this.tabShow2 = false;
				this.tabShow3 = true;
				this.tabpance1 = '';
				this.tabpance2 = '';
				this.tabpance3 = 'on';
				this.NotajaxMore();
			},
			mxDataEdit(value,id){//编辑墓穴信息
				this.mxDataModal = true;
				this.$http.get(global.host+'/cemeteryGrave/query/one?id='+id,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.mxDataObj=Object.assign(this.mxDataObj, response.body.result);
					this.mxDataObj.graveId = id;					
					this.mxDataObj.cemeteryId = value;
					this.getprovince2();
				})
				.catch(function (response) {
					
				})	
			},
			submitMxData(){
				this.$http.post(global.host+'/cemeteryGrave/insert',this.mxDataObj,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
                .then((response) => {	
                    if(response.body.status == 1){
                        this.$Message.success('提交修改成功!');                    
                        this.mxDataModal = false;
                    }else{
                        this.$Message.error(response.body.message);
                    }
                })
                .catch(function (response) {
                    
                });
			},
			gzDataEdit(value){//编辑用户信息
				this.userDataModal = true;
				this.zjDataObj.cemeteryId = value;
				this.$http.get(global.host+'/cemeteryOwner/query/one?id='+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
                .then((response) => {	
                    if(response.body.status==1){
                        this.zjDataObj = Object.assign(this.zjDataObj,response.body.data);
						this.zjDataObj.nativeProvinceId ?  this.zjDataObj.nativeProvinceId: this.zjDataObj.nativeProvinceId="";
						this.zjDataObj.nativeCityId ?  this.zjDataObj.nativeCityId: this.zjDataObj.nativeCityId="";
						this.zjDataObj.nativeAreaId ?  this.zjDataObj.nativeAreaId: this.zjDataObj.nativeAreaId="";
						this.zjDataObj.cardType ?  this.zjDataObj.cardType: this.zjDataObj.cardType="";
						if(this.zjDataObj.birthAndDeathDate){
							this.zjDataObj.birthAndDeathDate = this.zjDataObj.birthAndDeathDate.split(",");						
						}
						this.zjDataObj.nation = response.body.data.nation;				
						this.zjDataObj.nation ?  this.zjDataObj.nation: this.zjDataObj.nation ="";											
						this.getprovince3();
						this.getnation();
						this.getIdcardtype();
                    }
                })
			},
			timeChoose(data){
				this.zjDataObj.birthAndDeathDate = data;
			},
			submitZjData(value){			
				//this.zjDataObj.cardNo = this.zjDataObj.cardNo == null ? this.zjDataObj.cardNo == "" : this.zjDataObj.cardNo;
				var idcard =  /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
				if(!idcard.test(this.zjDataObj.cardNo) && this.zjDataObj.cardNo !=''){
					this.$Message.error("请输入正确的身份证号!");
					return;
				}
				if(this.zjDataObj.birthAndDeathDate){
					if(this.zjDataObj.birthAndDeathDate[0] == ""){
						this.zjDataObj.birthAndDeathDate = "";
					}else{
						this.zjDataObj.birthAndDeathDate = this.zjDataObj.birthAndDeathDate.join(",");						
					}
				}else{
					this.zjDataObj.birthAndDeathDate = "";
				}
				this.$http.post(global.host+'/cemeteryGrave/edit/lifebook',this.zjDataObj,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
                .then((response) => {	
                    if(response.body.result == 1){
                        this.$Message.success('提交成功!');       
						this.userDataModal = false;                                     
                    }else{
                        this.$Message.error('保存失败');
                    }
                })
                .catch(function (response) {
                    
                });
			},
			editZj(template,id,status){
				if(status == 2){
					//待审核状态
					this.$Modal.confirm({
						width:"320",
						content: "<p>该人物传记正在审核中，继续编辑需要重新审核，是否继续编辑？</p>",
						onOk: () => {
							this.$router.push({ path: '/templateEdit' ,query:{"nid":template,"mid":id}});//跳转传记页面		
						},
						onCancel: () => {
						}
					});
				}else if(status == 3){
					//审核成功
					this.$Modal.confirm({
						width:"320",
						content: "<p>该人物传记已审核成功，继续编辑需要重新审核，是否继续编辑？</p>",
						onOk: () => {
							this.$router.push({ path: '/templateEdit' ,query:{"nid":template,"mid":id}});//跳转传记页面		
						},
						onCancel: () => {
						}
					});
				}else if(status == 4){//草稿箱编辑传记
					this.$router.push({ path: '/templateEdit' ,query:{"nid":template,"mid":id}});//跳转传记页面
				}
			},
			applicationPublic(cemeteryId){//申请公开展示
				this.$Modal.confirm({
					width:"320",
					content: "<p>确定要申请公开么？</p>",
					onOk: () => {
						this.$http.post(global.host+'/cemeteryOwner/applyFor/open/lifebook',{"cemeteryId":cemeteryId},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
						.then((response) => {	
							if(response.body.status == 1){
								this.$Message.success('申请成功');
								//this.PageNum = 1;
								this.ajaxMore();								
							}else{
								this.$Message.error('申请失败');
							}
						})
						.catch(function (response) {
							
						});
					},
					onCancel: () => {
					}
				});
			},
			cancelPublic(cemeteryId){//取消公开展示
				this.$Modal.confirm({
					width:"320",
					content: "<p>确定要取消公开展示么？</p>",
					onOk: () => {
						this.$http.post(global.host+'/cemeteryOwner/cancel/open/lifebook',{"cemeteryId":cemeteryId},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
						.then((response) => {	
							if(response.body.status == 1){
								this.$Message.success('取消成功');
								//this.PageNum = 1;
								this.ajaxMore();								
							}else{
								this.$Message.error('取消失败');
							}
						})
						.catch(function (response) {
							
						});
					},
					onCancel: () => {
					}
				});
			},
			filter(value) {//value为13位的时间戳
				function add0(m) {
					return m < 10 ? '0' + m : m
				}
				var time = new Date(parseInt(value));
				var y = time.getFullYear();
				var m = time.getMonth() + 1;
				var d = time.getDate();
				return y + '.' + add0(m) + '.' + add0(d) + '';
			},
			ajax(){
				//this.hotsimg = global.host;
				this.tokendata={"Authorization":this.user.token_type+" "+this.user.access_token}
				console.log("tooken"+this.tokendata);
				this.$http.post(global.host+'/cemeteryOwner/query',{"startPage":this.PageNum,"pageSize":14},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					if(response.body.total == 0){
						this.havedata = true;	
						this.nothavemore = true;											
					}else{
						this.zjdata = response.body.result;//传记信息
						//this.hotsimg = global.host;
						if(response.body.total <= 14 ){//数据已全部查出
							this.nothavemore = true;
						}
					}
				})
				.catch(function (response) {
					
				})	
			},
			ajaxMore(){
				this.tokendata={"Authorization":this.user.token_type+" "+this.user.access_token}
				this.$http.post(global.host+'/cemeteryOwner/query',{"startPage":this.PageNum,"pageSize":14},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					if(response.body.total == 0){
						this.havedata = true;	
						this.nothavemore = true;											
					}else{
						this.zjdatatotal = response.body.total;
						this.zjdata = response.body.result;
						//this.zjdata.push.apply(this.zjdata, response.body.result); 							
						// if(this.zjdata.length == response.body.total ){//数据已全部查出
						// 	this.nothavemore = true;
						// }
					}
				})
				.catch(function (response) {
					
				})	
			},
			ajaxMorePage(value){//传记列表分页
				document.body.scrollTop = 0;
            	document.documentElement.scrollTop = 0;
				this.PageNum =  value;
				this.ajaxMore();
			},
			myjoinajaxMore(){
				this.$http.post(global.host+'/cemeteryOwner/sweep/query',{"startPage":this.myjoinPageNum,"pageSize":14},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					if(response.body.total == 0){
						this.myjoinhavedata = true;	
						this.myjoinnothavemore = true;											
					}else{
						this.joindatatotal = response.body.total;
						this.joindata = response.body.result;
						//this.joindata.push.apply(this.joindata, response.body.result); 	
						//this.hotsimg = global.host;
						// if(this.joindata.length == response.body.total){//数据已全部查出
						// 	this.myjoinnothavemore = true;
						// }
					}
				})
				.catch(function (response) {
					
				})	
			},
			myjoinajaxMorePage(value){
				document.body.scrollTop = 0;
            	document.documentElement.scrollTop = 0;
				this.myjoinPageNum = value;
				this.myjoinajaxMore();
			},
			NotajaxMore(){				
				this.$http.post(global.host+'/cemeteryOwner/query/unpublish',{"startPage":this.NotPageNum,"pageSize":14},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					if(response.body.total == 0){
						this.Nothavedata = true;	
						this.Notnothavemore = true;											
					}else{
						this.Notdatatotal = response.body.total;
						this.Notdata = response.body.result;
						// this.Notdata.push.apply(this.Notdata, response.body.result); 	
						// if(this.Notdata.length == response.body.total){//数据已全部查出
						// 	this.Notnothavemore = true;
						// }
					}
				})
				.catch(function (response) {
					
				})	
			},
			NotajaxMorePage(value){
				document.body.scrollTop = 0;
            	document.documentElement.scrollTop = 0;
				this.NotPageNum = value;
				this.NotajaxMore();
			},
			deleteZj(cemeteryId,graveId,type){
				this.$Modal.confirm({
					width:"320",
                    content: '<p>确定要删除这个传记么？删除之后无法恢复</p>',
                    onOk: () => {
						this.$http.post(global.host+'/cemeteryOwner/delete',{"cemeteryId":cemeteryId,"graveId":graveId},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
						.then((response) => {	
							if(response.body.status ==1){
								this.$Message.success('删除成功');
								if(type==1){
									this.tabsFun();
								}else{
									this.tabsFun3();
								}
								
							}
						})
						.catch(function (response) {
							
						})	
                    },
                    onCancel: () => {
                    }
                });
				
			},	
			creadZj(){
				this.$http.get(global.host+"/cemeteryOwner/query/last",{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {
					if(response.body.exceedStatus == 0){
						if(response.body.result){
							this.$Modal.confirm({
								width:"320",
								content: '<p>是否使用上次未保存的草稿？</p>',
								onOk: () => {
									if(response.body.result.templateId){
										this.$router.push({ path: '/templateEdit' ,query:{"nid":response.body.result.templateId,"mid":response.body.result.cemeteryId}});//跳转传记页面
									}else{
										this.$router.push({ path: '/templateList' ,query:{"s":response.body.result.cemeteryId}});//跳转传记页面
									}					
								},
								onCancel: () => {
									this.$http.post(global.host+"/cemeteryOwner/clearNoSaveDraftBox",{"cemeteryId":response.body.result.cemeteryId},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
									.then((response) => {
										this.creadGet();
										//this.creadZjMod = true;										
									})
									.catch(function (response) {
	                				})
								}
							});

						}else{
							console.log('进来了');
							this.creadGet();
							//this.creadZjMod = true;
						}

					}else{
						this.$Modal.error({
								width:"320",
								content: '<p>您创建的人物传记已超过上限，请删除后再做操作</p>',
								onOk: () => {

								}
						});
					}
					
				})
                .catch(function (response) {
                })
			},
			creadGet(){//新建传记接口
				this.$http.get(global.host+"/cemeteryGrave/create/lifebook",{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {
					if(response.body.status == 1){
						this.$router.push({ path: '/templateList' ,query:{"s":response.body.cemeteryId}});//跳转模板列表
					}else{
						this.$Message.error(response.body.message);
					}
				})
				.catch(function (response) {
                })
			},
			CreatSubmit(name){//新建传记 输入二维码点击下一步 form表单
				this.$refs[name].validate((valid) => {
					if(valid){
						this.$http.post(global.host+"/cemeteryGrave/qrCode/binding",{"qrCode":this.formQrcode.number},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
						.then((response) => {
							//this.$router.push({ path: '/templateList' ,query:{"s":response.body.result.id}});//跳转传记页面	
							if(response.body.status == 1){
								this.$router.push({ path: '/templateList' ,query:{"s":response.body.datas.id}});//跳转传记页面
							}else{
								this.$Message.error(response.body.message);
							}									
						})
	                    .catch(function (response) {
	                    })
					}
				})
			},
			notEwmNext(){//无二维码选项				
				//查询省
				this.creadZjMod = false;
				this.chooseSSqMod = true;				
				this.$http.get(global.host+'/location/province/all/query',{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.provinceList = response.body.data;
				})
				.catch(function (response) {
					
				});
				
			},
			getprovince(value){
				//查询市
				this.$http.get(global.host+"/location/city/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.cityList = response.body.data;
				})
				.catch(function (response) {
					
				})	
			},
			getcity(value){
				//查询区
				this.$http.get(global.host+"/location/district/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.districtList = response.body.data;
				})
				.catch(function (response) {
					
				})	
			},
			getdistrict(value){
				this.district = value;
			},
			chooseTemplate(){//跳转选择模板页面
				//判断是否选择省市区
				if(this.district){								
					this.chooseSSqMod = false;				
					this.$http.post(global.host+"/cemeteryGrave/insert/owner",{"cemeteryProvinceId":this.province,"cemeteryCityId":this.city,"areaId":this.district},{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
					.then((response) => {
						this.$router.push({ path: '/templateList' ,query:{"s":response.body.result.id}});//跳转传记页面										
					})
                    .catch(function (response) {
                    })					
				}else{
					this.$Message.error('请选择省市区');				
				}
			},
			//墓穴信息编辑弹窗
			getprovince2(){
                //获取省
                this.$http.get(global.host+'/location/province/all/query',{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.provinceList2 = response.body.data;
				})				
            },
            getcity2(value){
				//查询市
				this.$http.get(global.host+"/location/city/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.cityList2 = response.body.data;
				})					
			},
            getqu2(value){
				//查询区
				this.$http.get(global.host+"/location/district/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.districtList2 = response.body.data;
				})					
			},
            getly(value){//查询陵园
                this.$http.get(global.host+"/cemeteryComm/cemetery/query/by/area?areaId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.lyList = response.body.data;
				})
            },
            getyq(value){
                //查询园区
                this.$http.get(global.host+"/cemeteryComm/cemetery/query/by/id?cemeteryId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.yqList = response.body.data;
				})
            },
			handleSuccess(res, file){//照片上传图片
                this.mxDataObj.certificatePath =  file.response.fileName;
                this.hasMxphoto = false;
            },
			//籍贯
            getprovince3(){
                //获取省
				
                this.$http.get(global.host+'/location/province/all/query',{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.jgprovinceList = response.body.data;
				})				
            },
             getcity3(value){
				//查询市
				this.$http.get(global.host+"/location/city/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.jgcityList = response.body.data;
				})					
			},
            getqu3(value){
				//查询区
				this.$http.get(global.host+"/location/district/query?parentId="+value,{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.jgdistrictList = response.body.data;
				})					
			},
            getnation(){
                //查询民族
                this.$http.get(global.host+"/common/master/data/query?masterDataType=1",{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.nationList = response.body.result;
				})	
            },
            getIdcardtype(){
                 //证件类型
                this.$http.get(global.host+"/common/master/data/query?masterDataType=7",{headers:{"Authorization":this.user.token_type+" "+this.user.access_token}})
				.then((response) => {	
					this.idcardList= response.body.result;
				})
			},
			//我参加的人物传记
			checkBiography(cemeteryId,template,status){//查看人物传记
				if(status=="4"){return;}
				this.$router.push({ path: '/publish',query:{"cemeteryId":cemeteryId,"template":template}});//跳转传记页面
			},
			uploadPhotoError(file) {
                this.$Notice.warning({
                    title: '文件格式不正确',
                    desc: '文件 ' + file.name + ' 格式不正确，请上传JPG、JPEG、PNG格式的图片。'
                });
			},
			closeCread(){
				this.$refs.formUserEwm.resetFields();
			},
			birthdayTime(time){         
                function add0(m) {
					return m < 10 ? '0' + m : m
				}
				var time = new Date(parseInt(time));
				var y = time.getFullYear();
				var m = time.getMonth() + 1;
				var d = time.getDate();
				if(this.customized == 1){//判断是否需要中文
					y = this.Arabia(y);				
					m = this.Arabia2(m);				
					d = this.Arabia2(d);	
					this.birthDayAnd = " 至 ";
				    return y + '年' + add0(m) + '月' + add0(d) + '日';                    
				}else{
					this.birthDayAnd = " - ";
				    return y + '-' + add0(m) + '-' + add0(d) + '';
                }
            },
            Arabia(Num){
				for (var i = Num.length - 1; i >= 0; i--) {
					Num = Num.replace(",", "")//替换Num中的“,”
					Num = Num.replace(" ", "")//替换Num中的空格
				}    
				//字符处理完毕后开始转换，采用前后两部分分别转换
				var part = String(Num).split(".");
				var newchar = "";
				//小数点前进行转化
				for (i = part[0].length - 1; i >= 0; i--) {
					var tmpnewchar = ""
					var perchar = part[0].charAt(i);
					switch (perchar) {
						case "0":  tmpnewchar = "零" + tmpnewchar;break;
						case "1": tmpnewchar = "一" + tmpnewchar; break;
						case "2": tmpnewchar = "二" + tmpnewchar; break;
						case "3": tmpnewchar = "三" + tmpnewchar; break;
						case "4": tmpnewchar = "四" + tmpnewchar; break;
						case "5": tmpnewchar = "五" + tmpnewchar; break;
						case "6": tmpnewchar = "六" + tmpnewchar; break;
						case "7": tmpnewchar = "七" + tmpnewchar; break;
						case "8": tmpnewchar = "八" + tmpnewchar; break;
						case "9": tmpnewchar = "九" + tmpnewchar; break;
					}
					newchar = tmpnewchar + newchar;
				}   
				return newchar;
			},
			Arabia2(Num){				
				for (var　i = Num.length - 1; i >= 0; i--) {
						Num = Num.replace(",", "")//替换Num中的“,”
						Num = Num.replace(" ", "")//替换Num中的空格
				}    
				//字符处理完毕后开始转换，采用前后两部分分别转换
				var part = String(Num).split(".");
				var newchar = "";
				//小数点前进行转化
				for (var i = part[0].length - 1; i >= 0; i--) {
					var tmpnewchar = ""
					var perchar = part[0].charAt(i);
					switch (perchar) {
						// case "0":  tmpnewchar = "零" + tmpnewchar;break;
						case "1": tmpnewchar = "一" + tmpnewchar; break;
						case "2": tmpnewchar = "二" + tmpnewchar; break;
						case "3": tmpnewchar = "三" + tmpnewchar; break;
						case "4": tmpnewchar = "四" + tmpnewchar; break;
						case "5": tmpnewchar = "五" + tmpnewchar; break;
						case "6": tmpnewchar = "六" + tmpnewchar; break;
						case "7": tmpnewchar = "七" + tmpnewchar; break;
						case "8": tmpnewchar = "八" + tmpnewchar; break;
						case "9": tmpnewchar = "九" + tmpnewchar; break;
					}
					switch (part[0].length - i - 1) {
						case 0: tmpnewchar = tmpnewchar; break;
						case 1: if (perchar != 0) tmpnewchar = tmpnewchar + "十"; break;
						case 2: if (perchar != 0) tmpnewchar = tmpnewchar + "百"; break;
						case 3: if (perchar != 0) tmpnewchar = tmpnewchar + "千"; break;
						case 4: tmpnewchar = tmpnewchar + "万"; break;
						case 5: if (perchar != 0) tmpnewchar = tmpnewchar + "十"; break;
						case 6: if (perchar != 0) tmpnewchar = tmpnewchar + "百"; break;
						case 7: if (perchar != 0) tmpnewchar = tmpnewchar + "千"; break;
						case 8: tmpnewchar = tmpnewchar + "亿"; break;
						case 9: tmpnewchar = tmpnewchar + "十"; break;
					}
					newchar = tmpnewchar + newchar;
				}   
				//替换所有无用汉字，直到没有此类无用的数字为止
				while (newchar.search("零零") != -1 || newchar.search("零亿") != -1 || newchar.search("亿万") != -1 || newchar.search("零万") != -1) {
					newchar = newchar.replace("零亿", "亿");
					newchar = newchar.replace("亿万", "亿");
					newchar = newchar.replace("零万", "万");
					newchar = newchar.replace("零零", "零");      
				}
				//替换以“一十”开头的，为“十”
				if (newchar.indexOf("一十") == 0) {
					newchar = newchar.substr(1);
				}
				//替换以“零”结尾的，为“”
				if (newchar.lastIndexOf("零") == newchar.length - 1) {
					newchar = newchar.substr(0, newchar.length - 1);
				}
				return newchar;
			},
			showBackModal(value){//打开意见反馈弹窗
				this.backModal = value;//根据组件传出的参数来修改传入的值
			},
			bodyClick(){
				this.backModal = false;
			}
		}
    }
</script>